{% import 'macro.html' as M  %}
<script src="/static/parsley.min.js"></script>
<style>
  #tblviewtaxon {width: 100%}
  #tblviewtaxon th {width: 100px;font-weight: normal;background-color: #EEE;}
  #tblviewtaxon td {word-break: break-word; padding: 3px 5px;}
  #At2PopupWindow0 .At2PopupWindow {width: 1000px;}
</style>
<form id="formedittaxon" method="post" action="?">
<input type="hidden" name="id" value="{{ taxon.id }}">
<table class=" " id="tblviewtaxon">
  <tr>  <th>名称</th><td colspan="3">{{ M.InputText('name',taxon.name,"class=form-control required maxlength=100") }}</td>
    <th>类型</th><td style="width: 200px">{{ M.selectinputdict('taxotype', g.TaxoType, taxon.taxotype,addemptyrow=True,extrataginfo="class=form-control required")  }}</td>
  </tr>
  <tr>  <th>显示名</th><td colspan="5">{{ taxon.display_name }}</td></tr>
  <tr>
    <th>上层ID</th><td colspan="5">
      <select id="parent_id" name="parent_id" class="taxolbpop" required>
        {% if taxon.parent_id %}
        <option value="{{ taxon.parent_id }}">{{ taxon.parentname }}</option>
        {% endif %}
      </select>
     </td>
  </tr>
  <tr>  <th>谱系</th><td colspan="5">{{ taxon.tree.replace('>',' > ') }}</td></tr>

  <tr>
{#    <th>Source ID</th><td>{{ M.InputText('id_source', taxon.id_source ,extrataginfo="class=form-control maxlength=20 style='width:100px'"|safe)  }} </td>#}
    <th>源链接
      <i class="fas fa-info-circle" data-content="如果新目录已经在网上作出了描述，请提供链接以帮助Ecotaxoserver管理人员查看并为所有用户补充这个新类别。"></i>
    </th><td colspan="5">
        {{ M.InputText('source_url', taxon.source_url,extrataginfo="class=form-control maxlength=200 data-parsley-sourceurl=1 data-parsley-validate-if-empty=1")  }}    </td></tr>
  <tr><th>源描述
      <i class="fas fa-info-circle" data-content="如果该类别没有在网上描述过，请提供对这个类别的描述，以帮助其他用户使用它。"></i>
  </th><td colspan="5">
    {{ M.TextArea('source_desc',4, taxon.source_desc,extrataginfo="class=form-control maxlength=1000 data-parsley-sourcedesc=1 data-parsley-validate-if-empty=1 ")  }}
    </td></tr>
  <tr>
    <th>电子邮件
      <i class="fas fa-info-circle" data-content="如果您更改了邮箱，您将无法再管理此分类。"></i>
    </th><td colspan="3">
    {{ M.InputText('creator_email', taxon.creator_email ,extrataginfo=("class=form-control maxlength=250 data-parsley-type=email "+("READONLY" if taxon.creator_email.find('@')>0 else ""))|safe)  }}
    </td>
    <th>创建日期</th><td>
        {{ M.InputText('creation_datetime', taxon.creationdatetimefmt ,extrataginfo="class=form-control maxlength=200 pattern='\d{4}-\d{1,2}-\d{1,2} \d{1,2}:\d{1,2}:\d{1,2}' style='width:150px' READONLY"|safe)  }} </td>
</tr>


</table>
<table style="width: 100%;margin-top: 10px;">
  <tr><td><button type="submit" class="btn btn-success"><i class="fa fa-save"></i> 保存分类</button>
  {% if taxon.id>0 %}
    <button type="button" onclick="DeleteTaxon({{ taxon.id }})" class="btn btn-danger"><i class="fa fa-eraser"></i> Delete Taxon</button>
  {% endif %}
  </td>
    <td style="text-align: right"><button type="button" onclick="At2PopupClose(0);" class="btn btn-gris"><i class="fa fa-times"></i> Close</button></td></tr>
</table>
</form>
<div id="formedittaxon_PostResult" style="margin-top: 10px"></div>
<div class="panel panel-default " style="padding: 5px;">
  创建分类的命名规则 :<br>
  - Phylo类型：必须是唯一的，只包含字母和- +，及不超过1个的空格，以大写字母开头 <br>
  - Morpho类型：对上层来说必须是唯一的，只包含字母和- +，及不超过1个的空格，必须是小写的。<br>
{#  In case of repeated creation error ask help to users listed on <a href="{{ g.taxoserver_url }}/browsetaxo/" target="_blank">this page</a>#}
如果重复创建错误，请向Ecotaxa实例管理员请求帮助 <ul>{{ GetManagerList('Ecotaxa : Account issue')|safe }}</ul>
</div>

<style>
  .taxolbpop {width: 400px;}
</style>
<script>
  $(".taxolbpop").select2({
        ajax: {
            url: "/search/taxo",
            dataType: 'json',
            delay: 250,
            data: function (params) {  return { q: params.term, page: params.page };  },
            processResults: function (data, page) { return { results: data};  },
            cache: true
        },
        minimumInputLength: 3
        /*,allowClear:true know bug on it #5394*/
    }); // Select2 Ajax
  window.Parsley.addValidator('sourcedesc', {
  validateString: function(value) {
    if($('#taxotype').val()!='M') return true;
    return value !== '' ;
  },  messages: { en: 'You must enter a source description for Morpho type' }
});
  window.Parsley.addValidator('sourceurl', {
  validateString: function(value) {
    if($('#taxotype').val()!='P') return true;
    var re=new RegExp(
      "^" +
        // protocol identifier
        "(?:(?:https?)://)?" + // ** mod: make scheme optional
        // user:pass authentication
        "(?:\\S+(?::\\S*)?@)?" +
        "(?:" +
          // IP address exclusion
          // private & local networks
          // "(?!(?:10|127)(?:\\.\\d{1,3}){3})" +   // ** mod: allow local networks
          // "(?!(?:169\\.254|192\\.168)(?:\\.\\d{1,3}){2})" +  // ** mod: allow local networks
          // "(?!172\\.(?:1[6-9]|2\\d|3[0-1])(?:\\.\\d{1,3}){2})" +  // ** mod: allow local networks
          // IP address dotted notation octets
          // excludes loopback network 0.0.0.0
          // excludes reserved space >= 224.0.0.0
          // excludes network & broacast addresses
          // (first & last IP address of each class)
          "(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])" +
          "(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}" +
          "(?:\\.(?:[1-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))" +
        "|" +
          // host name
          "(?:(?:[a-zA-Z\\u00a1-\\uffff0-9]-*)*[a-zA-Z\\u00a1-\\uffff0-9]+)" +
          // domain name
          "(?:\\.(?:[a-zA-Z\\u00a1-\\uffff0-9]-*)*[a-zA-Z\\u00a1-\\uffff0-9]+)*" +
          // TLD identifier
          "(?:\\.(?:[a-zA-Z\\u00a1-\\uffff]{2,}))" +
        ")" +
        // port number
        "(?::\\d{2,5})?" +
        // resource path
        "(?:/\\S*)?" +
      "$"
    );
    return re.test(value)!==false;
  },  messages: { en: 'You must enter a valid source URL for Phylo type' }
});
  $('#formedittaxon').parsley();


  $('#formedittaxon').submit(function(e){
    e.preventDefault();
    var DejaCliqued=$(this).data('DejaCliqued');
    $(this).data('DejaCliqued','Y');
    if(DejaCliqued==='Y')
      return;
    setTimeout(function(){ $('#formedittaxon').data('DejaCliqued','N'); }, 5000);
    var formobj=objectifyForm('formedittaxon');
    AtdSetWaitAndLoad("#formedittaxon_PostResult",'/taxo/save/',formobj);
  });
  function DeleteTaxon(id) {
    At2Confirm("Taxon removal","Are you sure you want remove this taxon",function () {
      AtdSetWaitAndLoad("#formedittaxon_PostResult",'/taxo/del/',{id:id});
    });
  }
  $('#tblviewtaxon .fa-info-circle').popover({trigger:'hover',container:"body",placement:"top"})

</script>